<template>
  <ve-card title="押金退款">
    <!-- 是否租车押金抵扣 -->
    <!--
      租车押金应收已收，【且剩余金额不为0，[totalCarRentAmount 不为0]】
      租车押金状态 carDepositStatus And 违章押金状态 illegalDepositStatus 枚举
      10, "应收未收"
      30, "应收已收"
      50, "应退未退"
      70, "应退已退"
    -->
    <ve-form-item label="是否租车押金抵扣" v-if="[30, 50].includes(depositConfig.carDepositStatus) && totalCarRentAmount > 0">
      <ve-radio v-model="form.depositDeductFlag" :list="radioList" />
    </ve-form-item>
    <!-- 租车押金是否转违章押金 -->
    <!-- 租车押金应收已收或应退未退，违章押金应收未收，且剩余租车押金不为0 -->
    <ve-form-item
      label="租车押金是否转违章押金"
      v-if="[30, 50].includes(depositConfig.carDepositStatus) && [10].includes(depositConfig.illegalDepositStatus) && leftCarRentAmount > 0"
    >
      <ve-radio v-model="form.changeDepositFlag" :list="radioList" />
    </ve-form-item>
    <!-- 详细费用 -->
    <!-- 退租车押金 -->
    <ve-form-item disabled="true" label="退租车押金" unit="元">
      <ve-input-number disabled :model-value="returnCarDeposit" />
    </ve-form-item>
    <ve-form-item disabled="true" label="退违章押金" unit="元">
      <ve-input-number disabled :model-value="depositConfig.illegalDeposit || 0" />
    </ve-form-item>
    <!-- 其他押金无交互，仅作展示 -->
    <template v-if="depositConfig.depositList && depositConfig.depositList.length > 0">
      <ve-form-item disabled="true" :label="item.depositTypeName" v-for="(item, index) in depositConfig.depositList" :key="index" unit="元">
        <!-- 当前可用押金 -->
        <ve-input-number disabled v-model="item.currentlyAvailableDepositAmount" />
      </ve-form-item>
    </template>
    <ve-form-item label="退押金备注" :borderBottom="false">
      <ve-input v-model="form.backDepositRemark" />
    </ve-form-item>
  </ve-card>
</template>
<script setup>
  import { reactive, inject, computed, watch } from 'vue'
  import { queryActiveAmountAPI } from '@/api/order/sOrder'
  import { decimalAddition, decimalSubtract } from '@/utils'
  import { buildTreeData, processTreeData } from '../../components/order-fee/fee-statistic.js'
  import { isValid } from '@/utils'
  const form = inject('form')
  const orderInfo = inject('orderInfo')
  const props = defineProps({
    orderId: [String, Number, null],
  })

  // 押金
  const depositConfig = reactive({
    carDeposit: null,
    illegalDeposit: null,
    depositList: [],
  })

  const radioList = [
    {
      label: '是',
      value: 1,
    },
    {
      label: '否',
      value: 0,
    },
  ]

  watch(
    () => props.orderId,
    (orderId) => {
      if (orderId) {
        // 获取当前可用押金
        queryActiveAmountAPI({ orderId }).then((res) => {
          const result = res.result
          // 租车押金
          depositConfig.carDeposit = result.carDepositAmount
          // 自定义租车押金
          depositConfig.customDepositAmount = result.customDepositAmount
          // 违章押金
          depositConfig.illegalDeposit = result.illegalDepositAmount
          // 其他押金
          depositConfig.depositList = result.depositList

          // 租车押金状态
          depositConfig.carDepositStatus = result.carDepositStatus
          // 违章押金状态
          depositConfig.illegalDepositStatus = result.illegalDepositStatus
        })
      }
    },
    { immediate: true }
  )

  const feeForm = inject('feeForm')

  // 当前录入的费用合计（为正或者为负）
  const sumFee = computed(() => {
    let orderFee = feeForm.value.orderFee
    let sum = 0
    if (orderFee) {
      let data = buildTreeData(orderFee)
      let feeTreeStData = processTreeData(data)
      if (feeTreeStData.length > 0) {
        feeTreeStData.forEach((item) => {
          sum = decimalAddition(sum, item.value)
        })
      }
    }
    return sum
  })
  // 押金抵扣金额
  const depositDeductAmount = computed(() => {
    // 租车押金金额
    // 编辑还车费，可能是已经押金抵扣过，也可能是没有押金抵扣过
    let carDeposit = depositConfig.carDeposit
    // 押金抵扣过，编辑的时候就只能用抵扣的钱
    if (isValid(orderInfo.value.depositDeductionAmount)) {
      carDeposit += orderInfo.value.depositDeductionAmount
    }
    // 是否押金抵扣
    if (form.value.depositDeductFlag && sumFee.value > 0) {
      if (carDeposit > sumFee.value) {
        return sumFee.value
      } else {
        return carDeposit
      }
    }
    return 0
  })
  watch(
    () => depositDeductAmount.value,
    (newVal) => {
      form.value.depositDeductAmount = newVal
    },
    { immediate: true }
  )
  // 退租车押金显示金额
  const returnCarDeposit = computed(() => {
    // 剩余车辆租金
    let carDeposit = depositConfig.carDeposit || 0
    // 当前还车操作占用租金
    let depositDeductionAmount = orderInfo.value.depositDeductionAmount || 0
    return decimalAddition(carDeposit, depositDeductionAmount)
  })
  // 总的租车押金
  const totalCarRentAmount = computed(() => {
    // 当前押金
    let carDeposit = depositConfig.carDeposit || 0
    // 自定义押金
    let customDepositAmount = depositConfig.customDepositAmount || 0
    // 押金合计
    let sumDepositAmount = decimalAddition(carDeposit, customDepositAmount)
    // 租车押金金额
    // 编辑还车费，可能是已经押金抵扣过，也可能是没有押金抵扣过
    // 押金抵扣过，编辑的时候就只能用抵扣的钱
    if (isValid(orderInfo.value.depositDeductionAmount)) {
      sumDepositAmount += orderInfo.value.depositDeductionAmount
    }
    return sumDepositAmount
  })
  // 剩余的租车押金
  const leftCarRentAmount = computed(() => {
    return decimalSubtract(totalCarRentAmount.value, depositDeductAmount.value)
  })
  watch(
    () => leftCarRentAmount.value,
    (newVal) => {
      if (newVal <= 0 && form.value.changeDepositFlag) {
        form.value.changeDepositFlag = 0
      }
    }
  )
  // 转违章金额
  const changeDepositAmount = computed(() => {
    // 转违章押金开关开启
    if (form.value.changeDepositFlag) {
      return leftCarRentAmount.value
    } else {
      return 0
    }
  })
  watch(
    () => changeDepositAmount.value,
    (newVal) => {
      form.value.changeDepositAmount = newVal
    },
    { immediate: true }
  )
</script>
<style lang="less" scoped></style>
